<template>
	<view class="brand">
		<search-top :fullLine="true" />
		<list :menuTabs="menuTabs"></list>
		<view class="brand-i">
			<view class="brand-n">
				<image src="../../static/images/beijing1.png" mode=""></image>
				<text class="tui">我要推广</text>
				<text class="fabu">发布图文推广</text>
			</view>
			<view class="brand-n">
				<image src="../../static/images/beijing11.png" mode=""></image>
				<text class="tui">我的推广</text>
				<text class="fabu">查看我的推广</text>
			</view>
		</view>
		<lister></lister>
	</view>
</template>

<script>
	import searchTop from "@/components/index/searchTop.vue"
	import list from "@/components/index/list.vue"
	import lister from "@/components/index/lister.vue"
	export default{
		components:{
			searchTop,
			list,
			lister
		},
		data() {
			return {
				menuTabs: [{
				    name: '推荐'
				}, {
				    name: '汽车'
				}, {
				    name: '教育培训'
				}, {
				    name: '餐饮美食'
				}, {
				    name: '休闲娱乐'
				}, {
				    name: '建材'
				}],
			}
		},
		onLoad() {
			//获取分类信息
			this.getCategoryList();
			console.log(":ll")
		},
		methods: {
			getCategoryList() {
				this.$post(this.api.categoryList).then((res) => {
					console.log(res.rows);
					this.menuTabs = res.rows;
				}).catch((err) => {
					console.log(err)
				})
			},
		}
	}
</script>

<style>
	.brand-i{
		width: 750rpx;
		height: 150rpx;
		margin-top: 20rpx;
	}
	.brand-n{
		width: 334rpx;
		height: 118rox;
        margin-left: 26rpx;
		float: left;
	}
	.brand-n image{
		width: 334rpx;
		height: 118rpx;
	}
	.tui{
		position: absolute;
		margin-top: 20rpx;
		margin-left: -230rpx;
		width: auto;
		height: 29rpx;
		font-size: 30rpx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #FFFFFF;
		line-height: 41rpx;
		letter-spacing: 5rpx;
	}
	.fabu{
		position: absolute;
		margin-top: 60rpx;
		margin-left: -240rpx;
		width: auto;
		height: 23rpx;
		font-size: 24rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #FFFFFF;
		line-height: 41rpx;
		letter-spacing: 5rpx;
	}
</style>
